@import 'variables';

:host {
  .modal-holder {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100%;
    z-index: 9999;

    .backdrop {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: rgba(255, 255, 255, 0.8);
      z-index: -1;
    }
  }

  &.has-visible-modals {
    .modal-holder {
      display: block;
    }
  }

}
